<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>02CSS继承计算值</title>
    <style>
        div {
            font-size: 16px;
            font-size: 2em;
        }

        /* 
            em 是一个相对单位，大小取决于当前元素字体大小，如果当前元素没有设置字体大小，
            从父类继承过来的字体大小，从父类继承过来的是父类的计算值大小
        */
        p {
            font-size: 16px;
            font-size: 2em;
        }

        .box {
            font-size: 32px;
        }

        span {
            font-size: 64px;
        }
    </style>
</head>

<body>
    <div>
        我是一个div
        <p>我是一段文字</p>
        <span class="box">我是另外一段文字</span>
        <span>我是另外一段文字</span>

    </div>
</body>

</html>